<template>
  <div>
    <r-search :searchForm="searchForm" :searchHandle="searchHandle" :searchData="searchData" />
    <r-table :tableHandles="tableHandles" :isSelection="false" :isIndex="false" :isPagination="true"
      :tableData="tableData" :tableCols="tableCols" :tablePage="tablePage" :isHandle="true"
      @refresh="init()"></r-table>
    <!--    <r-form :formRules="formRules" :formHandle="formHandle" :formData="formData" :formCols="formCols" ref="elForm" labelWidth="200px" dialogWidth="1000px" :isHandle="true" />-->
  </div>
</template>
<script>
export default {
  data() {
    return {
      searchData: {
        deviceType: '1',
        sn: '',
        oprType: '',
        result: '',
        phone: '',
        orderNo: ''
      },
      searchForm: [
        {
          type: 'input',
          prop: 'sn',
          placeholder: '设备编号',
          width: 150
        },
        {
          type: 'select',
          prop: 'oprType',
          placeholder: '操作类型',
          width: 150,
          options: [{ label: '开门取电池', value: '3' }, { label: '开门换电池', value: '4' }, { label: '开门换电池', value: '5' }]
        },
        {
          type: 'select',
          prop: 'result',
          placeholder: '操作状态',
          width: 150,
          options: [{ label: '失败', value: '0' }, { label: '成功', value: '1' }]
        },
        {
          type: 'input',
          prop: 'phone',
          placeholder: '手机号',
          width: 150
        },
        // {
        //   type: 'input',
        //   prop: 'name',
        //   placeholder: '充取状态',
        //   width: 150
        // },
        {
          type: 'input',
          prop: 'orderNo',
          placeholder: '订单编号',
          width: 150
        }
      ],
      searchHandle: [
        {
          label: '搜索',
          type: 'success',
          icon: 'el-icon-search',
          handle: e => this.init()
        }
      ],

      tableHandles: [
        // {
        //   label: "导出数据",
        //   type: "primary",
        //   handle: e => this.elFormVisible()
        // }
      ],
      tableData: [],
      tableCols: [
        {
          label: "设备编号",
          prop: "sn",
        },
        {
          label: '柜门号',
          prop: 'cabinetNo'
        },
        {
          label: '操作类型',
          prop: 'oprType',
          formatter: e => (e.oprType == 0 ? '管理员（运维）开门' : e.oprType == 3 ? '开门取电池' : e.oprType == 4 ? '开门换电池' : e.oprType == 5 ? '开门归还电池' : '--')
        },
        {
          label: '操作状态',
          prop: 'result',
          itemClass: e => (e.result == 0 ? 'danger' : e.result == 1 ? 'success' : ''),
          formatter: e => (e.result == 0 ? '失败' : e.result == 1 ? '成功' : '--')
        },
        {
          label: '操作人',
          prop: 'userName'
        },
        {
          label: '开始时间',
          prop: 'ctime'
        },
        {
          label: '结束时间',
          prop: 'ftime'
        },
        {
          label: '对应订单',
          prop: 'orderNo'
        }
      ],
      tablePage: { limit: 10, page: 1, total: 0 }
      // formData: {
      //   name: "",
      //   money: "",
      //   giftMoney: "",
      //   status: ""
      // },
      // formCols: [
      //   { type: "input", label: "套餐名称", width: 350, prop: "name" },
      //   { type: "input", label: "套餐金额", width: 350, prop: "money", remark: '元' },
      //   { type: "input", label: "赠送金额", width: 350, prop: "giftMoney", remark: '元' },
      //   { type: "switch", label: "上线/下线", width: 350, prop: "status" },
      // ],
      // formRules: {
      //   name: [
      //     { required: true, message: '请输入套餐名称', trigger: 'blur' },
      //   ],
      //   money: [
      //     { required: true, message: '请输入套餐金额', trigger: 'blur' },
      //   ],
      //   giftMoney: [
      //     { required: true, message: '请输入套餐金额', trigger: 'blur' },
      //   ],
      // },
      // formHandle: [
      //   {
      //     label: "取消",
      //     handle: e => this.elFormVisible(),
      //   },
      //   {
      //     label: "确定",
      //     type: "success",
      //     handle: e => this.elFormSubmit(),
      //   },
      //
      // ],
    }
  },
  components: {},
  computed: {},
  mounted() {
    if (this.$route.query.sn) {
      this.searchData.sn = this.$route.query.sn
    }
    this.init()
  },
  methods: {
    async init() {
      let parm = {
        ...this.searchData,
        ...{
          pageNum: this.tablePage.page,
          pageSize: this.tablePage.limit
        }
      }
      let res = await this.apis.deviceLog_list(parm)
      if (res) {
        this.tableData = res.rows
        this.tablePage.total = res.total
      }
    }
    // async elFormSubmit() {
    //   this.formData.state = this.formData.status == true ? 1 : 2
    //   if (this.formData.id) {
    //     let res = await this.api.packupdate(this.formData)
    //     if (res) {
    //       this.formData.id = ''
    //       this.elFormVisible()
    //       this.init()
    //     }
    //   } else {
    //     let res = await this.api.packadd(this.formData)
    //     if (res) {
    //       this.elFormVisible()
    //       this.init()
    //     }
    //   }
    // },
    // async changestate(id) {
    //   let res = await this.api.packchange({ id })
    //   if (res) {
    //     this.init()
    //   }
    // },
    // elFormDetail(row) {
    //   console.log(row);
    //   Object.keys(this.formData).forEach(key => {
    //     this.formData[key] = row[key]
    //   })
    //
    //   this.formData.status=row['state']==1?true:false
    //   this.formData.id = row.id;
    //   // if (this.formCols[1].label == '登录密码') {
    //   //     this.formCols.splice(1, 1)
    //   // }
    //
    //   this.elFormVisible()
    // },
  }
}
</script>
<style scoped lang="scss">
.el-icon-search {
  margin-right: 10px;
}
.Tip {
  margin-left: 20px;
}
</style>
